<template>
  <z-paging
    auto-show-back-to-top
    ref="paging"
    v-model="dataList"
    @query="queryList"
    :fixed="false"
    height="100%"
  >
    <block v-for="(item, index) in dataList" :key="index">
      <order-card :orderInfo="item">
        <!-- <button
					class="Btn evaluate bg-white text-sm text-muted leading-[60rpx] h-[60rpx] rounded-full"
					@click.stop="goPage('/bundle/pages/evaluate_list/index')"
					v-if="item.orderStatus==3"
				>
					售后
				</button>
                <order-footer
                    :orderId="item?.id"
                    :orderSn="item.sn"
                    :orderStatus="item.orderStatus"
                    :cancel="item.cancelBtn"
                    :evaluate="item.commentBtn"
                    :pay="item.payBtn"
                    :mobile="item?.mobile"
                    :del="item?.delBtn"
                    :type="2"
                    :order_amount="item.orderAmount"
                    @refresh="queryList"
                /> -->
        <order-footer
          :orderId="item?.id"
          :orderSn="item.sn"
          :orderStatus="item.orderStatus"
          :cancel="item.cancelBtn"
          :evaluate="item.commentBtn"
          :pay="item.payBtn"
          :mobile="item?.mobile"
          :del="item?.delBtn"
          :type="2"
          :order_amount="item.orderAmount"
          @refresh="queryList"
        />
      </order-card>
    </block>
  </z-paging>
</template>

<script lang="ts" setup>
import { ref, shallowRef, watch } from "vue";
import orderCard from "./order-card.vue";
import orderFooter from "@/components/order-footer/index.vue";
import { apiOrderLists } from "@/api/order";
import { onShow } from "@dcloudio/uni-app";
import { useLockFn } from "@/hooks/useLockFn";

const props = withDefaults(
  defineProps<{
    orderStatus: string | number;
  }>(),
  {
    orderStatus: "",
  }
);

const paging = shallowRef<any>(null);
const dataList = ref<any>([]);

watch(
  () => props.orderStatus,
  () => {
    paging.value?.reload();
  }
);

// 页面跳转
const goPage = (url: string) => {
  uni.navigateTo({ url });
};
const { lockFn: queryList } = useLockFn(async (pageNo = 1, pageSize = 10) => {
  try {
    const { lists } = await apiOrderLists({
      orderStatus: props.orderStatus,
      pageNo,
      pageSize,
    });
    paging.value.complete(lists);
  } catch (e) {
    console.log("报错=>", e);
    //TODO handle the exception
    paging.value.complete(false);
  }
});

onShow(() => {
  setTimeout(() => {
    paging.value.reload();
  }, 300);
});
</script>

<style scoped></style>
